<template>
  <view :data-theme="theme">
    <BasicComponents></BasicComponents>

    <CustomNavbar title="菜单" :left-icon="false" />
    <view class="layout" :style="_setScrollHeight()">
      <view class="sidebar">
        <view
          v-for="(item, index) in menu"
          :key="item.name"
          class="item"
          :class="index === selectIndex ? 'active' : ''"
          @tap="sidebarClick(index, item)"
        >
          <text v-if="index === selectIndex" class="tag" />
          {{ item.name }}
        </view>
      </view>
      <view class="layout-right">
        <view v-for="(item, key) in rightMenu" :key="item.name" class="m-b-10">
          <view class="select-name">
            {{ item.name }}
          </view>
          <view class="f-justify-around c">
            <view
              v-for="child in item.children"
              :key="child.name"
              :style="{ color: child.color }"
              class="child"
              @tap="skipPage(child)"
            >
              <view class="iconfont" :class="child.icon" />
              <view class="name">
                {{ child.name }}
              </view>
            </view>
          </view>
          <view v-if="key !== rightMenu.length - 1" class="cut-off-rule" />
        </view>
      </view>
    </view>
  </view>
</template>
<script setup lang="ts">
import menu from "./menu";
import { menuSonProp } from "./menu";
const theme = useThemeStore().theme;

onLoad(() => {
  const url_code = uni.getStorageSync("url_code");
  // ios退出后没有wx权限 重新进入重新获取权限  url_code: 当从登录页面过来获取一次wx权限
  if (url_code) {
    if (url_code) uni.removeStorageSync("url_code");
  }
  sidebarClick(selectIndex.value, menu[selectIndex.value]);
});

const _setScrollHeight = () => {
  return setScrollHeight(0);
};

let selectIndex = ref(0);
let rightMenu = ref([]);

// 右侧菜单点击
const sidebarClick = (index, item) => {
  const { children } = item;
  selectIndex.value = index;
  rightMenu.value = children;
  uni.setStorageSync("home_checked_index", index);
};

// 页面跳转
const skipPage = async (item: menuSonProp) => {
  const { path, skip, flag } = item || {};
  if (skip) {
    const params = {
      flag
    };
    uni.navigateTo({
      url: transitionParams(params, path)
    });

    uni.setStorageSync("home_checked_index", selectIndex.value);
    return;
  }
};
</script>
<style src="./index.scss"></style>
